@import "../helper";
.fui-dialog {
  position: fixed; background: white; min-width: 20em;
  z-index: 2;
  border-radius: 4px; top: 50%; left: 50%; transform: translate(-50%, -50%);
  &-mask { position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: fade_out(black, 0.5);
    z-index: 1;
  }
  &-header {
    font-size: 22px;
    padding: 8px 16px;
    border-bottom: 1px solid grey;
  }
  &-main {
    padding: 8px 16px;
    min-height: 6em;
  }
  &-footer {
    padding: 8px 16px;
    border-top: 1px solid grey;
    display: flex;
    justify-content: flex-end;
  }
  &-close {
    position: absolute;
    bottom: 100%;
    left: 100%;
    background: $main-color;
    width: 2em;
    height: 2em;
    border-radius: 50%;
    transform: translate(-50%, 50%);
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
  }
}